<DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>秒杀页面</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <link rel="stylesheet" href="/zhaojun/layui/css/layui.css" media="all">
    </head>
    <body>
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>秒杀</legend>
    </fieldset>

    <div style="padding: 20px; background-color: #F2F2F2;">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="layui-card">
                    <div class="layui-card-header">秒杀商品</div>
                    <div class="layui-card-body">
                        <table class="layui-table" id="shopTableId" lay-filter="shopTableFilter" lay-data="{height: 'full-200'}"></table>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <script src="/zhaojun/layui/layui.js" type="text/javascript" charset="utf-8"></script>
    <!--表格操作-->
    <script type="text/html" id="tableBar">
        <a class="layui-btn layui-btn-sm" lay-event="kill">秒杀</a>
    </script>

    <script>
        layui.use(['element', 'layer', 'table'], function () {
            var $ = layui.$;
            var layer = layui.layer;
            var table = layui.table;
            //允许同源(相同域名不同端口)跨域配置
            $.ajaxSetup({
                xhrFields: {
                    withCredentials: true
                },
                crossDomain: true
            });
            table.render({ //其它参数在此省略
                elem: "#shopTableId",
                url: 'http://127.0.0.1:8031/zhaojun-service-order/seckillList/list',
                method: 'GET',
                cols: [
                    [
                        {field: 'id', title: 'ID'}
                        , {field: 'name', title: '商品名称'}
                        , {field: 'number', title: '商品数量'}
                        , {field: 'startTime', title: '开始时间'}
                        , {field: 'endTime', title: '结束时间'}
                        , {fixed: 'right', title: '操作', toolbar: '#tableBar'}
                    ]
                ],
                page: true
            });


            //监听工具条
            table.on('tool(shopTableFilter)', function (obj) {
                var data = obj.data;
                var userId = window.localStorage.getItem("userId");
                if (obj.event === 'kill') {
                    $.post("http://127.0.0.1:8031/zhaojun-service-order/seckill/dbSeckill", {"seckillId": data.id, "userId": userId}, function (data) {
                        if (data.code == '200') {
                            layer.msg(data.msg);
                        } else {
                            layer.msg(data.msg);
                        }
                    });
                }
            });
        });
    </script>

    </body>
    </html>